<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>将ref作为参数传递</title>
</head>

<body>
    <script lang="ts">
        function add (a: number, b: number) {
            return a + b
        }
        let c = add(1, 2) // 3 

        function add (a: Ref<number>, b: Ref<number>) {
            return computed(() => a.value + b.value)
        }
        let c = add(ref(1), ref(2))
        c.value // 3

        function add (a: Ref<number> | number, b: Ref<number> | number) {
            return computed(() => unref(a) + unref(b))
        }

        let c = add(ref(1), 5)
        c.value // 6

        // ******************************************
        function ref(input) {
            return isRef(input) ? input : createRef(input)
        }
        // 也就是说
        const a = ref(123) 
        const b = ref(a)
        a === b // true
        // 窍门: ref()会直接返回已经是Ref的值

        function unref(input) {
            return isRef(input) ? input.value : input
        }
        // 也就是说
        const foo = unref(123)
        foo === 123 // true
        // 窍门: unref()会直接返回非Ref的值

    </script>
</body>

</html>